<template>
	<div class="cloneContainer">
		<div class="header">
			<a-input-search v-model:value="searchData['search_AND_LIKE_assistantName']" placeholder="请输入搜索内容" style="width: 200px" @search="show" />
		</div>
		<div class="content">
			<div class="list">
				<div class="item" v-for="item in listData" :key="item.id">
					<div style="display: flex;justify-content: space-between;">
						<div style="display: flex;">
							<div>{{ item.dictName }}</div>
							<div style="margin-left: 50px;font-size: 14px;color: #9d9d9d;">{{ item.createdTime }}</div>
						</div>
						<a-badge dot />
					</div>
					<div style="margin-top: 10px;">{{ item }}</div>
				</div>
				<div class="noData" v-if="!listData.length">
					<BellOutlined class="icon" />
					最近没有收到此类消息
				</div>
			</div>
			<a-pagination hideOnSinglePage style="text-align: center" @change="show" v-model:current="pagination.current" show-size-changer  v-model:pageSize="pagination.size"
				:total="pagination.totalElements" />
		</div>

	</div>
</template>
<script setup>
import { reactive, ref,onMounted } from 'vue'
import { teacherAssistantPage, teacherAssistantFindById, teacherAssistantSave, teacherAssistantDelete } from '@/request/teacher/clone'
import { typeCategory, teacherList } from '@/request/addAndEditProject'
import { studentSseUserMessage } from '@/request/notice/message'
import { message } from 'ant-design-vue'
import { BellOutlined } from '@ant-design/icons-vue'
import {
		isTeacher
	} from "@/stores/info"
import { useRouter, useRoute } from 'vue-router'
import {getStudentMessageList,getTeacherMessageList} from '@/request/notice/message'

const route=useRoute()
const firstShow = async () => {
	
//   let res = {
//     课程: await studentSseUserMessage({ field: 'course_category' }),
//     // 教师列表: await teacherList()
//   }
//   if (res['课程']) listData.value = res['课程'].data
	// if (res['教师列表']) selectStructure.value.coTeacherIds = res['教师列表'].data
}
firstShow()

onMounted(()=>{
	searchData.value['search_AND_EQ_category']=route.meta.value
	searchData.value['search_AND_EQ_category']=1
	console.log(searchData.value)

	show()
})

const listData = ref([])
const searchData = ref({})
const pagination = ref({ totalElements: 11, current: 1, size: 10 })
const show = async () => {

	let req = {
		...pagination.value,
		page: pagination.value.current - 1,
		...searchData.value
	
	}
	console.log('req',req)
	// let res = await teacherAssistantPage(req)
	let res
	if(isTeacher()){
		res=await getTeacherMessageList(req)
	}else{
		res=await getStudentMessageList(req)
	}
	console.log('res',res)


	if (!res) return
	listData.value = [...res.data.content]
	pagination.value = {
		...pagination.value,
		...res.data.page,
		current:res.data.page.number+1
	}
}


const formModel = ref({})
const formRef = ref()
const rules = {
	assistantName: [
		{ required: true, message: '请输入', trigger: 'change', },
	],
	link: [
		{ required: true, message: '请输入', trigger: 'change', },
	],
	course: [
		{ required: true, message: '请输入', trigger: 'change', },
	],
	sortOrder: [
		{ required: true, message: '请输入', trigger: 'change', },
	],
	teacherId: [
		{ required: true, message: '请输入', trigger: 'change', },
	],
}

const handleClick = async ({ name, record }) => {
	let req = {
		...record
	}
	let res = null
	switch (name) {
		case '删除':
			break
	}
}

const handleSubmit = async () => {
}

</script>

<style lang="scss" scoped>
.cloneContainer {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;

	.header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: white;
		border-radius: 10px;
		height: 80px;
		padding: 20px;
	}

	.content {
		margin-top: 20px;
		padding: 20px;
		overflow: auto;
		flex: 1;
		display: flex;
		flex-direction: column;
		background: white;
		border-radius: 10px;
		.list {
			width: 100%;
			flex:1;
			min-height: 0;
			overflow: auto;
			padding: 10px 0;
			display: flex;
			flex-direction: column;
			.item {
				width: 100%;
				padding: 20px;
				border: 1px solid #e8e8e8;
				margin-bottom: 20px;
				cursor: pointer;
			}
		}
	}
	.noData {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		height: 100%;
		color: #bcc0c7;
		font-size: 20px;
		.icon {
			font-size: 60px;
			margin-bottom: 30px;
		}
	}
}
</style>